// 白天模式
@ran-background: #fff; // 全局主色

// 黑暗模式
@ran-dark-background: #1f1f1f; // 全局主色
@ran-dark-border: #3030; // 全局主色


.dynamicText{
    color:#12a3f5;
    animation: shadowing 1s ease-in-out infinite alternate;
}

.content{
	background:@ran-background;
    box-sizing: border-box;
	min-height: calc( 100vh - 80px - 64px - 12px);
	box-sizing: border-box;
	padding:10px;
}
.ant-layout-sider{
    background:@ran-background !important;
}

.background{
	background:@ran-background;
	border-color:#ccc;
}
.custom-dark {
    .background{
        background:@ran-dark-background;
        color:#FFF;
        border-color:@ran-dark-border;
    }
   .content{
        background:@ran-dark-background
    }
    .ant-layout-sider{
        background:@ran-dark-background !important;
    }
}



@keyframes shadowing{
    to{
        color:aqua;
        text-shadow:20px 0 70px aqua;
    }
}
.nameColorList(100);
.nameColorList(@n, @i: 1) when (@i =< @n) {
    .dynamicText:nth-child(@{i}) {
        animation-delay: (@i * 0.05s);
    }
.nameColorList(@n, (@i + 1));
}

// 数值
// 百分比 width
.widthList(100);
.widthList(@n, @i: 1) when (@i =< @n) {
    .width@{i} {
        width: (@i + 0%);
    }
    .minWidth@{i} {
        min-width: (@i + 0%);
    }
.widthList(@n, (@i + 1));
}

// 百分比height
.heightList(100);
.heightList(@n, @i: 1) when (@i =< @n) {
    .height@{i} {
        height: (@i + 0%);
    }
    .minHeight@{i} {
        min-height: (@i + 0%);
    }
    .maxHeight@{i} {
        max-height: (@i + 0%);
    }
.heightList(@n, (@i + 1));
}
